.btn {
  @extend .s-btn;

  &-primary {
    background: $color-primary;
    color: $white;
  }

  &-default {
    color: $text-color;
    background: $white;
    border: 2rpx solid $border-color;
  }

  &-info {
    color: $white;
    background: $color-info;
  }

  &-error {
    color: $white;
    background: $color-danger;
  }

  &-plain-primary {
    color: $color-primary;
    background: $color-primary-light;
    border: 2rpx solid mix($white, $color-primary, 30%);
  }

  &-success {
    background: $color-success;
    color: $white;
  }

  &-white {
    background: $white;
    color: $color-primary;
  }

  &-disabled {
    cursor: not-allowed;
    background: $color-info-light;
    color: $color-info-disabled;
    border-color: $color-info-light;
  }

  &-opacity {
    opacity: 0.5;
  }

  &-radius {
    border-radius: 8rpx;
  }

  &-block {
    width: 100%;
  }
}
